<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./lib/iconfont/iconfont.css">
    <link rel="stylesheet" href="./css/swiper.css">
    <link rel="stylesheet" href="./css/index.css">
    <style>
        .swiper {
            position: relative;
            margin-top: 0.33rem;
            overflow: hidden;
        }

        .swiper-wrapper {
            width: 300%;
            display: flex;
        }

        .swiper img {
            display: block;
            width: 100%;
        }

        .swiper-slide {
            width: 80%;
            text-align: center;
            font-size: 18px;
            background: #fff;
        }

        .swiper-slide-active,
        .swiper-slide-duplicate-active {
            transform: scale(1);
        }
    </style>
</head>

<body>
    <header> 智慧商场 </header>
    <div class="main">
        <!-- 搜索框 -->
        <div class="search">
            <a href="./search.html"><span class="iconfont icon-sousuokuang"></span> 搜索你要找的商品</a>
        </div>
        <!-- 轮播图 -->
        <div class="swiper">
            <div class="swiper-wrapper">

            </div>
            <div class="swiper-pagination"></div>
            <!--分页器。如果放置在swiper外面，需要自定义样式。-->
        </div>

        <!-- 公告 -->
        <div class="announcement">
            <p class="iconfont icon-laba"></p>
            <p>智慧商城2.0全新上线，更多新品等你来选~</p>
        </div>
        <!-- 分类 -->
        <div class="classify">
            <!-- <a href="">
                <img src="./lib/swiper轮播图demo/uploads/轮播图.png" alt="">
                <p>新品首发</p>
            </a> -->
        </div>
        <!-- 主会场 -->
        <div class="home">
            <!-- <img src="" alt=""> -->
        </div>
        <!-- 猜你喜欢 -->
        <div class="like">
            <p style="text-align:center;padding:5px 0;">—— 猜你喜欢 ——</p>

        </div>
        <!-- 商品列表 -->
        <div class="goods-item">
            <!-- <div class="item">
                <div class="left_photo">
                    <img src="" alt="">
                </div>
                <div class="right_txt">
                    <h3></h3>
                    <p></p>
                    <p></p>
                    <span></span>
                </div>
            </div> -->
        </div>
    </div>




    <footer>
        <a href="" class="active">
            <i class="iconfont icon-shouye"></i>
            <p>首页</p>
        </a>
        <a href="./classify.html">
            <i class="iconfont icon-fenlei"></i>
            <p>分类</p>
        </a><a href="">
            <i class="iconfont icon-gouwuchekong"></i>
            <p>购物车</p>
        </a><a href="./home.html">
            <i class="iconfont icon-wode"></i>
            <p>我的</p>
        </a>
    </footer>
</body>
<script src="./js/axios.js"></script>
<script src="./js/swiper.js"></script>
<script src="./js/index.js"></script>
<script>

</script>

</html>